@extends('home')
@section('title'){{$title}}@endsection
@section('content')
    <div class="container smart-container manual-project">
        <div class="manual-project-box">
            <div class="pull-left">
                <div class="manual-project-box-img">
                    <img src="{{asset('static/images/project_default.png')}}" width="50">
                </div>
                <div class="manual-project-box-title">
                    {{$title}}
                </div>

            </div>

            <div class="clearfix"></div>
        </div>

        <div class="manual-project-body">
            <div class="tab-head">
                <a href="javascript:;" class="tab-item active" data-target="#tab-structure">数据结构</a>
                <a href="javascript:;" class="tab-item" data-target="#tab-json">JSON</a>

                <div class="clearfix"></div>
            </div>
            <div class="tab-content">
                <div class="tab-item active editor-content" id="tab-structure">
                    @foreach($tables as $table)
                        <h4>表名：{{$table['table_name']}} {{$table['table_comment']}}</h4>
                        <table style="display: table;">
                            <thead>
                                <tr>
                                    <th align="left" style="width:180px;">字段名</th>
                                    <th align="left" style="width:150px;">数据类型</th>
                                    <th align="left" style="width:120px;">JAVA类型</th>
                                    <th align="left" style="width:80px;">允许空</th>
                                    <th align="left" style="width:100px;">是否自增</th>
                                    <th style="width:100px;">默认值</th>
                                    <th>注释</th>
                                </tr>
                            </thead>
                            <tbody>
                            @foreach($table['column'] as $column)
                                <tr>
                                    <td align="left">{{$column['column_name']}}</td>
                                    <td align="left">{{$column['column_type']}}</td>
                                    <td align="left">{{$column['java_type']}}</td>
                                    <td align="left">{{$column['is_nullable']  == 'YES' ? '是':'否'}}</td>
                                    <td>{{$column['auto_increment'] ? '是':''}}</td>
                                    <td>{{$column['column_default']}}</td>
                                    <td>{{$column['column_comment']}}</td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                        <h4>&nbsp;</h4>
                    @endforeach
                </div>
                <div class="tab-item editor-content" id="tab-json">

@foreach($tables as $table)
<h4>表名：{{$table['table_name']}} {{$table['table_comment']}}</h4>
<pre><code class="hljs json">{
@foreach($table['column'] as $key => $column)
    "{{$column['column_name']}}":"{{$column['java_type']}}, <i>{{$column['column_comment']?$column['column_comment']:$column['column_name']}}</i>"@if($key < count($table['column']) -1),@endif

@endforeach
}</code></pre>
<h4>&nbsp;</h4>
@endforeach


                </div>

            </div>
        </div>
        <div class="clearfix"></div>
    </div>
    @endsection


<script type="text/javascript" src="{{asset('static/highlight/highlight.js')}}"></script>
<script type="text/javascript" src="{{asset('static/highlight/highlightjs-line-numbers.min.js')}}"></script>
<style type="text/css">
    .hljs.json i .hljs-string{
        font-style: normal;
        color: #7f9f7f;
    }
</style>
@section('scripts')
<script type="text/javascript">
/**
 * 初始化高亮插件
 */
function initHighlighting() {
    $('pre code').each(function (i, block) {
        hljs.highlightBlock(block);
    });

    hljs.initLineNumbersOnLoad();
}
$(function () {
    initHighlighting();
   $(".tab-head>.tab-item").on('click',function () {
       $(this).closest('.tab-head').children('.tab-item').removeClass('active');
       $(this).addClass('active');
       $(".tab-content>.tab-item").removeClass('active');
       var target = $(this).attr('data-target');
       $(target).addClass('active');
   }) ;
});

</script>
@endsection